<template>
  <el-select
    :value="innerValue"
    :placeholder="param.placeholder || `请选择${param.paramName}`"
    size="medium"
    style="width: 100%"
    filterable
    clearable
    @change="handleSelect"
  >
    <el-option
      v-for="opt in param.options"
      :key="opt.value"
      :label="opt.label"
      :value="opt.value"
    />
  </el-select>
</template>

<script>
export default {
  name: 'SelectInput',
  props: {
    value: { 
      type: [Object, String, Number],
      required: true 
    },
    param: { 
      type: Object, 
      required: true 
    }
  },
  computed: {
    innerValue() {
      console.log('SelectInput - 当前值:', {
        value: this.value,
        type: typeof this.value
      })
      
      // 处理各种值格式
      if (!this.value) {
        return ''
      }
      
      // 如果是对象格式 { value: '', isValid: true, message: '' }
      if (typeof this.value === 'object' && this.value !== null) {
        return this.value.value || ''
      }
      
      // 如果是原始值
      return this.value
    }
  },
  methods: {
    handleSelect(val) {
      console.log('SelectInput - 选择变化:', {
        选择值: val,
        参数: this.param.paramName
      })
      
      // 统一发射对象格式
      const result = {
        value: val,
        isValid: true,
        message: ''
      }
      
      this.$emit('change', result)
    }
  }
}
</script>